<!DOCTYPE html >
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>商品列表</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" th:href="@{/resource/css/bootstrap.min.css}" />
    <link rel="stylesheet" th:href="@{/resource/css/font-awesome.min.css}" />
    <link rel="stylesheet" th:href="@{/resource/css/animate.css}" />
    <link rel="stylesheet" th:href="@{/resource/css/style.css}" />
    <link th:href="@{/resource/css/plugins/sweetalert/sweetalert.css}" rel="stylesheet">
    <link th:href="@{/resource/css/plugins/bootstrap-table/bootstrap-table.min.css}" rel="stylesheet">
    <link rel="stylesheet" th:href="@{/resource/css/plugins/toastr/toastr.min.css}" />

</head>

<body class="gray-bg">

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <div class="row">
                        <div class="col-sm-10">  <h5>分类管理 &nbsp;/&nbsp;</h5><h5 style="color: red;" th:text="${name}"></h5><h5>&nbsp;/&nbsp;  列表</h5></div>
                        <div class="col-sm-2">
                            <input type="hidden" id="cid" th:value="${id}" >
                            <input type="hidden" th:value="${name}">
                            <button class="btn btn-primary" id="categort_item_add" type="button">添加</button>

                        </div>
                    </div>

                </div>
                <div class="ibox-content">
                    <input type="text"  id="menu_code" style="display: none" />
                    <div class="alert alert-success" style="display: none" id="CategoryTableEventsResult" role="alert">

                    </div>
                    <!-- Example Events -->
                    <div class="example-wrap">
                        <table id="CategoryTableEvents" data-height="400" data-mobile-responsive="true" class="table table-hover">
                            <thead>
                            </thead>
                        </table>
                    </div>
                </div>
                <!-- End Example Events -->

            </div>
        </div>
    </div>
</div>
</div>

<div th:include="footer"></div>
<script th:src="@{/script/js/plugins/sweetalert/sweetalert.min.js}"></script>
<script type="text/javascript" th:src="@{/script/js/contabs.js}"></script>

<script>
    $(function () {
       var cid = $("#cid").val();

        $('#CategoryTableEvents').bootstrapTable({
        url: "/common/category/getCategoryItemByCid/"+cid,
        search: false,
        pagination: true,
        showRefresh: true,
        showToggle: false,
        showColumns: false,
        pageSize:15,
        height:600,
        iconSize: 'outline',
        toolbar: '#CategoryTableEventsToolbar',
        columns:[{
            field: 'SerialNumber',
            title: '序号',
            width:30,
            formatter: function (value, row, index) {
                return index+1;
            }},
            {
                field:'id',
                title:'ID',
                width:60
            },
            {
                field:'name',
                title:'名称',
                width:200
            },
            {
                field:'orderno',
                title:'排序',
                width:80
            },
            {
                field:'picurl',
                title:'图片',
                width:100
            },

            {
                field:'flag',
                title:'状态',
                width:80,
                formatter: function(value, row, index) {
                    if(row.flag == '0') {
                        return "<font color='#228b22'>正常</font>";
                    } else {
                        return "<font color='#dcdcdc'>下架</font>";
                    }
                }
            },
            {
                field:'action',
                title:'操作',
                formatter: function(value, row, index) {
                    return [
                        '<shiro:hasPermission name="admin:ordervip:update">'+
                        '<a class="edit ml10" href="javascript:void(0)" title="修改">'+
                        '<i class="glyphicon glyphicon-edit"></i></a></shiro:hasPermission>&nbsp;&nbsp;&nbsp;&nbsp;',
                        '<a class="delete ml12" href="javascript:void(0)" title="删除">'+
                        '<i class="glyphicon glyphicon-remove-circle"></i></a></shiro:hasPermission>'
                    ].join('');
                },    //紫色为添加图标（icon），插件：font-awesome，效果图见底部。
                events: {
                    'click .delete': function(e, value, row, index) {
                        $.confirm({
                            title: '刪除!',
                            content: '确认删除吗!',
                            confirm: function(){
                                $.ajax({
                                    url: "/common/special/delSpecialProductById",
                                    data: sid+"_"+row.pid,
                                    type: "post",
                                    contentType: "application/json",
                                    dataType:"json",
                                    success: function (data) {
                                        if(data["retType"] == "0") {
                                            toastr.success("删除成功!");
                                            $("#productTableEvents").bootstrapTable("refresh");
                                        } else {
                                            alert(data["retMsg"]);
                                        }
                                    }
                                });
                            },
                            cancel: function(){

                            }
                        });
                    },'click .edit': function(e, value, row, index) {
                        window.location.href="/common/category/doItemEditor/"+row.id;
                    }
                }
            },


        ]
    });

    $("#categort_item_add").click(function () {
        window.location.href="/common/category/doAddCategoryItem/"+cid;
    });



    });

</script>
</body>
</html>